<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ page
	import="com.google.gson.*, java.util.*, com.reserv.dao.*, com.reserv.vo.*"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	Object obj = session.getAttribute("sList");
	ArrayList<ServiceVO> list = null;
	
	if(obj instanceof ArrayList<?>)
		list = (ArrayList<ServiceVO>) obj;
	else
		list = new ArrayList<ServiceVO>();
	
	Gson gson = new Gson();
	String jsonList = gson.toJson(list);
	
	pageContext.setAttribute("jsonList", jsonList);
%>
<c:if test="${ not empty sessionScope.isLogin }">
	<aside>
		<div id="qMenuBar">
			<p>오늘 본 시설</p>
			<div>
				<div>
					<ul class="list-inline">
						<li><a id="prev" href="#">◀</a></li>
						<li><span id="page"></span></li>
						<li><a id="next" href="#">▶</a></li>
					</ul>
				</div>
			</div>
			<div>
				<ul class="list-unstyled" id="listItem">
				</ul>
			</div>
		</div>
	</aside>
</c:if>

<!--  quickBar controller -->
<script>
	var sList = ${ jsonList };
	
	var pageSize = 4;	//페이지당 4개
	var currentPage = 1;	//현재 페이지
	var startRow = (currentPage - 1) * pageSize;//글 시작 순서
	
	var listCount = sList.length;	//총 갯수
	console.log("listCount : " + listCount);
 	//총 페이지 갯수
	var pageCount = Math.ceil(listCount / pageSize);
 	if(pageCount == 0)
 		pageCount = 1;
	console.log("pageCount : " + pageCount);
 	
	$(document).ready(function() {
		create(startRow);
	});
	function create(startRow) {
		if(listCount > 0) {
			$("#listItem").empty();
			for(var i = startRow; i < pageSize + startRow; i++) {
			console.log( i + "/" + startRow );			
				if(i == listCount) {	break; }
				$("#listItem").append("<li><a href='/Reservation/reserv/view.res?sno=" + sList[i].sno 
						+ "'><img src='../img/fImg/" + sList[i].img + ".jpg' " 
						+ "style='width: 90px; height: 50px; margin-top: 13px;' /></a></li>");
			}
		}
		$("#page").html(currentPage + "/" + pageCount);
	}
	$("#prev").click(function() {
		if(currentPage > 1) {
			currentPage -= 1;
			startRow = (currentPage - 1) * pageSize;
			create(startRow);
		} else {
			currentPage = pageCount;
			startRow = (currentPage - 1) * pageSize;
			create(startRow);
		}
	});
	$("#next").click(function() {
		if(currentPage < pageCount) {
			currentPage += 1;
			startRow = (currentPage - 1) * pageSize;
			create(startRow);
		} else {
			currentPage = 1;
			startRow = (currentPage - 1) * pageSize;
			create(startRow);
		}
	});
 	$(document).ready(function() {
		$("#qMenuBar").animate({"top" : ($(document).scrollTop() + 93) + "px"}, 800); 
 		$(window).scroll(function() {
			$("#qMenuBar").stop();
			$("#qMenuBar").animate({"top" : ($(document).scrollTop() + 93) + "px"}, 800);
		}); 
	});
</script>